<!DOCTYPE html>
<!--3个js-->
<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/easyui/locale/easyui-lang-zh_CN.js"></script>
<!--2个css-->
<link rel="stylesheet" href="../js/easyui/themes/default/easyui.css" />
<link rel="stylesheet" href="../js/easyui/themes/icon.css" />
<!--ztree-->
<script type="text/javascript" src="../js/ztree/jquery.ztree.all-3.5.js" ></script>
<link rel="stylesheet" href="../js/ztree/zTreeStyle.css" />
<script>
	$(function() {
		var setting = {
			data: {
				simpleData: {
					enable:true
				}
			},
			callback: {
				beforeClick: function(treeId, treeNode) {
					var zTree = $.fn.zTree.getZTreeObj("tree");
					if (treeNode.isParent) {
						zTree.expandNode(treeNode);
						return false;
					} else {
						demoIframe.attr("src",treeNode.file + ".html");
						return true;
					}
				}
			}
		};
		var zNodes = [
			{id:1, pId:0, name: "父节点1"},
			{id:2, pId:0, name: "父节点2"},
			{id:11, pId:1, name: "子节点11"},
			{id:12, pId:1, name: "子节点12"},
			{id:13, pId:2, name: "子节点21"},
			{id:14, pId:2, name: "子节点22"}
		];
		$.fn.zTree.init($("#basemenu"), setting, zNodes);
	})
</script>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body class="easyui-layout">

		<div data-options="region:'north',title:'传智播客.黑马程序员',split:true" style="height:100px;"></div>

		<div data-options="region:'south',title:'公司电话:020-23423423',split:true" style="height:100px;"></div>

		<div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width:80px;"></div>

		<div data-options="region:'west',title:'导航菜单',split:true" style="width:180px;">
			<div id="myaccordion" class="easyui-accordion" data-options="fit:true">

				<div data-options="iconCls:'icon-save',title:'基本功能'" style="overflow:auto;padding:10px;">

					<ul id="basemenu" class="ztree" style="width:260px; overflow:auto;"></ul>

				</div>

				<div title="系统管理" data-options="iconCls:'icon-reload',selected:true" style="padding:10px;">

					系统管理

				</div>

			</div>

		</div>

		<div data-options="region:'center'">
			<div id="mytabs" class="easyui-tabs" data-options="fit:true" style="width:500px;height:250px;">

				<div title="消息中心" style="padding:20px;">tab1 </div>

				<div title="论坛" data-options="closable:true" style="overflow:auto;padding:20px;display:none;">tab2 </div>

				<div title="评论" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;display:none;">tab3 </div>

			</div>
		</div>

	</body>

</html>